<?php
use_helper('I18N');
?>
<div class="breadcrumbs" id="breadcrumbs">
<script type="text/javascript" language="javascript">
    try {
        ace.settings.check('breadcrumbs', 'fixed')
    } catch(e) {
    }
    var datagrid = null;
    $(function() {
        $("#submitLink").click(function(event) {
            event.preventDefault();
            $("#registerForm").submit();
        });

        jQuery.validator.addMethod("noSpace", function(value, element) {
            return value.indexOf(" ") < 0 && value != "";
        }, "No space please and don't leave it empty");

        jQuery.validator.addMethod("loginRegex", function(value, element) {
            return this.optional(element) || /^[a-z0-9\-\s\_]+$/i.test(value);
        }, "This field only accept latin word, numbers, or dashes.");

        jQuery.validator.addMethod("latinRegex", function(value, element) {
            return this.optional(element) || /^[a-z0-9\-\s\_\/\.]+$/i.test(value);
        }, "This field only accept latin word, numbers, or dashes.");

        $("#registerForm").validate({
            messages : {
                "confirmPassword": {
                    equalTo: "<?php echo __('Please enter the same password as above') ?>"
                },
                "reg_ib": {
                    remote: "<?php echo __('Invalid Dealer ID') ?>."
                },
                "club_code": {
                    remote: "<?php echo __('Invalid Club ID') ?>."
                },
                "fullname": {

                }
            },
            rules: {
                "fullname" : {
                    required: true
                },
                "sponsorId" : {
                    required : true
                },
                "reg_ib" : {
                    required : true,
                    remote: "/member/verifyIB"
                },
                "club_code" : {
                    required : true,
                    remote: "/member/verifyClub"
                },
                "email" : {
                    required: true
                    , email: true
                },
                "userpassword" : {
                    required : true,
                    minlength : 6
                },
                "confirmPassword" : {
                    required : true,
                    minlength : 6,
                    equalTo: "#userpassword"
                },
                "securityPassword" : {
                    required : true,
                    minlength : 6
                },
                "confirmSecurityPassword" : {
                    required : true,
                    minlength : 6,
                    equalTo: "#securityPassword"
                },
                "contact" : {
                    required: true
                }
            },
            submitHandler: function(form) {
                waiting();
                $.ajax({
                    type : 'POST',
                    url : "/member/verifySponsorId",
                    dataType : 'json',
                    cache: false,
                    data: {
                        sponsorId : $('#sponsorId').val()
                    },
                    success : function(data) {
                        if (data == null || data == "") {
                            error("<?php echo __('Invalid Referrer ID') ?>");
                            $('#sponsorId').focus();
                            $("#sponsorName").val("");
                        } else {
                            form.submit();
                        }
                    },
                    error : function(XMLHttpRequest, textStatus, errorThrown) {
                        error("Your login attempt was not successful. Please try again.");
                    }
                });
            }
        });

        $("#sponsorId").change(function() {
            if ($.trim($('#sponsorId').val()) != "") {
                verifySponsorId();
            }
        });
    }); // end function

    function verifySponsorId() {
        waiting();
        $.ajax({
            type : 'POST',
            url : "/member/verifyActiveSponsorId",
            dataType : 'json',
            cache: false,
            data: {
                sponsorId : $('#sponsorId').val()
                , verifySameGroup : "Y"
            },
            success : function(data) {
                if (data == null || data == "") {
                    error("<?php echo __('Invalid Referrer ID') ?>");
                    $('#sponsorId').focus();
                    $("#sponsorName").val("");
                } else {
                    $.unblockUI();
                    $("#sponsorName").val(data.userName);
                }
            },
            error : function(XMLHttpRequest, textStatus, errorThrown) {
                alert("Your login attempt was not successful. Please try again.");
            }
        });
    }
</script>

    <ul class="breadcrumb">
        <li>
            <i class="icon-home home-icon"></i>
            <a href="#"><?php echo __('Member Registration') ?></a>
        </li>
    </ul>
    <!-- .breadcrumb -->

    <div class="nav-search" id="nav-search">
        <form class="form-search">
            <span class="input-icon">
                <input type="text" placeholder="Search ..." class="nav-search-input"
                       id="nav-search-input" autocomplete="off"/>
                <i class="icon-search nav-search-icon"></i>
            </span>
        </form>
    </div>
    <!-- #nav-search -->
</div>

<div class="page-content">
<!-- /.page-header -->
<div class="row">
<div class="col-xs-12">
<!-- PAGE CONTENT BEGINS -->

<?php include_component('component', 'alert', array('param' => $sf_user->getAttribute(Globals::SESSION_DISTID, 0))) ?>

<div class="row">
<div class="space-6"></div>

<div class="col-xs-12">
    <form action="/member/doMemberRegistration" id="registerForm" name="registerForm" method="post" class="form-horizontal" role="form">
        <h3 class="header smaller lighter green"><?php echo __('Personal Information') ?></h3>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="fullname"><span style="color: #D16E6C">* </span><?php echo __('Full Name'); ?></label>

            <div class="col-sm-9">
                <input name="fullname" type="text" id="fullname" placeholder="<?php echo __('Full Name'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <!--<div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="regPackage"><?php /*echo __('Package'); */?></label>

            <div class="col-sm-9">
                <select id="regPackage" name="regPackage">
                    <?php
/*                    foreach ($packageDBs as $packageDB) {
                        echo "<option value='" .$packageDB->getPackageId(). "'>".$packageDB->getPackageName(). " (". $packageDB->getPrice() . ")</option>";
                    }
                    */?>
                </select>
            </div>
        </div>

        <div class="space-4"></div>-->

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="userpassword"><span style="color: #D16E6C">* </span><?php echo __('Password'); ?></label>

            <div class="col-sm-9">
                <input name="userpassword" type="password" id="userpassword" placeholder="<?php echo __('Password'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="confirmPassword"><span style="color: #D16E6C">* </span><?php echo __('Confirm Password'); ?></label>

            <div class="col-sm-9">
                <input name="confirmPassword" type="password" id="confirmPassword" placeholder="<?php echo __('Confirm Password'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="securityPassword"><span style="color: #D16E6C">* </span><?php echo __('Security Password'); ?></label>

            <div class="col-sm-9">
                <input name="securityPassword" type="password" id="securityPassword" placeholder="<?php echo __('Security Password'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="confirmSecurityPassword"><span style="color: #D16E6C">* </span><?php echo __('Confirm Security Password'); ?></label>

            <div class="col-sm-9">
                <input name="confirmSecurityPassword" type="password" id="confirmSecurityPassword" placeholder="<?php echo __('Confirm Security Password'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="email"><?php echo __('Passport/ID Card No'); ?></label>

            <div class="col-sm-9">
                <input name="nric" type="text" id="nric" placeholder="<?php echo __('Passport/ID Card No'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <h3 class="header smaller lighter green"><?php echo __('Referrer') ?></h3>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="sponsorId"><span style="color: #D16E6C">* </span><?php echo __('Referrer ID') ?></label>

            <div class="col-sm-9">
                <input type="text" name="sponsorId" id="sponsorId" placeholder="<?php echo __('Referrer ID') ?>" class="col-xs-10 col-sm-5" value=""/>
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="sponsorName"><?php echo __('Referrer Name'); ?></label>

            <div class="col-sm-9">
                <input type="text" name="sponsorName" id="sponsorName" readonly="readonly" placeholder="<?php echo __('Referrer Name'); ?>" class="col-xs-10 col-sm-5" value=""/>
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="reg_ib"><span style="color: #D16E6C">* </span><?php echo __('Dealer ID') ?></label>

            <div class="col-sm-9">
                <input type="text" name="reg_ib" id="reg_ib" placeholder="<?php echo __('Dealer ID') ?>" class="col-xs-10 col-sm-5" value=""/>
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="club_code"><span style="color: #D16E6C">* </span><?php echo __('Club ID') ?></label>

            <div class="col-sm-9">
                <input type="text" name="club_code" id="club_code" placeholder="<?php echo __('Club ID') ?>" class="col-xs-10 col-sm-5" value=""/>
            </div>
        </div>

        <div class="space-4"></div>

        <h3 class="header smaller lighter green"><?php echo __('Contact Details') ?></h3>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="email"><span style="color: #D16E6C">* </span><?php echo __('Email'); ?></label>

            <div class="col-sm-9">
                <input name="email" type="text" id="email" placeholder="<?php echo __('Email'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><span style="color: #D16E6C">* </span><?php echo __('Telephone Number'); ?></label>

            <div class="col-sm-9">
                <input name="contact" type="text" id="contact" placeholder="<?php echo __('Telephone Number'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Address'); ?></label>

            <div class="col-sm-9">
                <input name="address" type="text" id="address" placeholder="<?php echo __('Address'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('City / Town'); ?></label>

            <div class="col-sm-9">
                <input name="city" type="text" id="city" placeholder="<?php echo __('City / Town'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Zip / Postal Code'); ?></label>

            <div class="col-sm-9">
                <input name="zip" type="text" id="zip" placeholder="<?php echo __('Zip / Postal Code'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('State / Province'); ?></label>

            <div class="col-sm-9">
                <input name="state" type="text" id="state" placeholder="<?php echo __('State / Province'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Country'); ?></label>

            <div class="col-sm-9">
                <?php include_component('component', 'countrySelectOption', array('countrySelected' => "China (PRC)", 'countryName' => 'country', 'countryId' => 'country')) ?>
            </div>
        </div>

        <div class="space-4"></div>

        <h3 class="header smaller lighter green"><?php echo __('Bank Account Details') ?></h3>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Bank Name'); ?></label>

            <div class="col-sm-9">
                <input name="bankName" type="text" id="bankName" placeholder="<?php echo __('Bank Name'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="bankSwiftCode"><?php echo __('Bank Swift Code / ABA'); ?></label>

            <div class="col-sm-9">
                <input name="bankSwiftCode" type="text" id="bankSwiftCode" placeholder="<?php echo __('Bank Swift Code / ABA'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Bank Branch'); ?></label>

            <div class="col-sm-9">
                <input name="bankBranchName" type="text" id="bankBranchName" placeholder="<?php echo __('Bank Branch'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Bank Address'); ?></label>

            <div class="col-sm-9">
                <input name="bankAddress" type="text" id="bankAddress" placeholder="<?php echo __('Bank Address'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Bank Account Number'); ?></label>

            <div class="col-sm-9">
                <input name="bankAccNo" type="text" id="bankAccNo" placeholder="<?php echo __('Bank Account Number'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right" for="contact"><?php echo __('Bank Account Holder Name'); ?></label>

            <div class="col-sm-9">
                <input name="bankHolderName" type="text" id="bankHolderName" placeholder="<?php echo __('Bank Account Holder Name'); ?>" class="col-xs-10 col-sm-5" />
            </div>
        </div>

        <div class="space-4"></div>

        <div class="clearfix form-actions">
            <div class="col-md-offset-3 col-md-9">
                <button class="btn btn-info" type="button" id="submitLink">
                    <i class="icon-ok bigger-110"></i>
                    <?php echo __('Submit') ?>
                </button>
            </div>
        </div>
    </form>
</div>

<div class="vspace-sm"></div>

<!-- /span -->
</div>
<!-- /row -->

<div class="hr hr32 hr-dotted"></div>

<!-- /row -->

<!-- PAGE CONTENT ENDS -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</div><!-- /.page-content -->